import React, { Component } from "react";
import { Accordion, Modal } from "antd-mobile";
import MainLayout from "@/component/mainLayout/mainLayout";
import "./index.scss";
import yhTools from "@tools/yh";

class commonProblem extends Component {
	constructor(props) {
		super(props);
		this.state = {
			visibleModal: false
		};
	}
	handleCallPhone = () => {
		let callPhoneData = {
			telphone: "4006906663"
		};
		yhTools.callPhone(callPhoneData);
	};
	render() {
		const _pageParams = {
			header: {
				title: "常见问题",
				goToApp: false
			},
			history: this.props.history
		};
		return (
			<MainLayout pageParams={_pageParams}>
				<div className="xhd-question-page">
					{/* </Scroll> */}
					{/* 小辉贷问题 */}
					<div>
						<Accordion className="custo-acc">
							<Accordion.Panel header="1.什么是小辉贷？" className="pad">
								<p className="info-content">
									小辉贷是一款用于个人消费的现金分期产品，旨在满足永辉消费者资金周转需求。
								</p>
							</Accordion.Panel>
							<Accordion.Panel header="2.申请条件" className="pad">
								<p className="info-content">
									1.年龄22周岁到56周岁之间（不含56周岁），具有完全民事行为能力的个人；
								</p>
								<p className="info-content">2.不为在校大学生；</p>
							</Accordion.Panel>
							<Accordion.Panel header="3.借款期限" className="pad">
								<p className="info-content">
									小辉贷借款期限一般有3、6、9、12期等，具体可选期数请以页面显示为准。
								</p>
							</Accordion.Panel>
							<Accordion.Panel header="4.借款额度" className="pad">
								<p className="info-content">
									小辉贷最高额度为20万元，根据每个账户使用情况不同，小辉贷额度也可能不一样。您可以点击【会员中心】-【小辉贷】-【申请开通】进行申请。
								</p>
							</Accordion.Panel>
							<Accordion.Panel header="5.还款方式" className="pad">
								<p className="info-content">
									1.主动还款，还款路径：【会员中心】-【小辉贷】-【去还款】。
								</p>
								<p className="info-content">
									2.自动还款：系统默认会在还款日从您的放款卡自动代扣，建议您在还款日当天上午10点前保持扣款资金充足。
								</p>
							</Accordion.Panel>
							<Accordion.Panel header="6.提前结清" className="pad">
								<p className="info-content">
									放款30天之后支持提前结清，提前结清按日计息，无手续费。
								</p>
							</Accordion.Panel>
						</Accordion>
						<div className="noproblem">
							<span className="no">没有找到合适的帮助信息？</span>
							<span
								className="customerService"
								onClick={() => {
									this.setState({ visibleModal: true });
								}}
							>
								联系客服
							</span>
						</div>
					</div>
				</div>
				<Modal
					visible={this.state.visibleModal}
					transparent
					maskClosable={false}
					onClose={() => {
						this.setState({ visibleModal: false });
					}}
					footer={[
						{
							text: "确定",
							onPress: () => {
								this.setState({ visibleModal: false });
							}
						}
					]}
				>
					<p className="customer-service">
						请前往永辉金融公众号留言，或拨打客服热线
						<a href="javascript:;" onClick={this.handleCallPhone}>
							400-690-6663
						</a>
					</p>
				</Modal>
			</MainLayout>
		);
	}
}

export default commonProblem;
